6. Images
Accessibility Requirements
- WCAG2 SC: 1.1.1. Non-Text – All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for [specific] situations.
- WCAG2 SC: 1.4.5 Images of Text – If the technologies being used can achieve the visual presentation, text is used to convey information rather than images of text except for [specific situations].
- WCAG2 SC: 4.1.2 Name, Role, Value – For all user interface components (including but not limited to: form elements, links, and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies.
Test Method Rationale
- The image tests evaluate the images as coded to discern whether the author of the content has determined they are meaningful or decorative. However, there are certain scenarios, as described in the tests, where the author’s programmatic determination could be incorrect.
- The tests include guidance from the W3C Web Accessibility Initiative Images Tutorial.
- All images must be evaluated. Multiple tests may apply to an image.
Limitations, Assumptions, Exceptions
- An image that has a non-empty text alternative has been determined to be meaningful by the content author. The author has decided that this image should not be ignored by assistive technology.
- An image that has an empty text alternative has been determined to be decorative by the content author. The author has determined that this image should be ignored by assistive technology.
- Commonly used image formats include .jpg, .png, .svg, .gif, .tiff, and .bmp. Other graphic formats are also in use and should be considered for this test.
- Decoration, Formatting, Invisible: If the image is pure decoration, is only used for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology.
- Images of text which are essential to the information being conveyed are exempt from SC 1.4.5. Logotypes (text that is part of a logo or brand name) are considered essential.
- The definition of image of text contains the note: “Note: This does not include text that is part of a picture that contains significant other visual content.” Examples of such pictures include graphs, screenshots, and diagrams which visually convey important information through more than just text.
6.A Test Procedure for Images with a non-empty text alternative
Baseline Test ID: 6.A-MeaningfulImage
Identify Content
Identify any image that has a non-empty text alternative (combination of the accessible name and accessible description) per the HTML Accessibility API Mappings 1.0 for img.
Test Instructions
- Check that none of the following is true [SC 1.1.1]:
- The image is page design/formatting and could be ignored by assistive technology without any loss of meaning.
- The image is not visible on the page.
- Check that the non-empty text alternative (combination of accessible name and accessible description) provides an equivalent description of the image's purpose. [SC 1.1.1]
Test Results
If any of the above checks fail, then Baseline Test 6.A-MeaningfulImage fails.
6.B Test Procedure for Images with an empty text alternative
Baseline Test ID: 6.B-DecorativeImage
Identify Content
Identify any image (including a background image) that has an empty text alternative.
Test Instructions
- Check that the empty text alternative has been programmatically assigned using one of the following techniques [SC 1.1.1]:
- The image is marked as decorative.
- The image is marked as an artifact.
- The image is only part of the background, header, footer, or on a hidden layer.
- Check that none of the following is true [SC 1.1.1]:
- The image is the only way to convey meaningful information.
- The image is in the tab order.
- The image is a functional image that initiates action.
Test Results
If any of the above checks fail, then Baseline Test 6.B-DecorativeImage fails.
6.C Test Procedure for Captchas – Not applicable to documents
Baseline Test ID: 6.C-Captcha
Captchas are not implemented in non-web documents, so this test is not applicable. It was not removed to maintain harmonization with the ICT Testing Baseline for Web.
Test Results
Baseline Test 6.C-Captcha is not applicable to documents.
6.D Test Procedure for Images of Text
Baseline Test ID: 6.D-ImageText
Identify Content
Identify any images of text, except where a particular presentation of text is essential to the information being conveyed (e.g., logotypes or text that is part of a logo or brand name).
Test Instructions
- Check that using text cannot achieve the same visual presentation and effect as images of text. [SC 1.4.5]
- Check that the image of text can be visually customized to a user's requirements. [SC 1.4.5]
For example, document content allows users to specify font, size, color, and background settings, and all images of text are then provided based on those settings (e.g., SmartArt, text art).
Test Results
If any of the above checks fail, then Baseline Test 6.D-ImageText fails.
Advisory: Tips for Streamlined Test Processes
None
WCAG 2.2 Techniques
The following sufficient techniques and/or common failures were considered when developing this test procedure for this baseline requirement:
- C9: Using CSS to include decorative images
- F3: Using CSS to include images that convey important information
- F20: Failure of Success Criterion 1.1.1 and 4.1.2 due to not updating text alternatives when changes to non-text content occur
- F30: Failure of Success Criterion 1.1.1 due to using text alternatives that are not alternatives (e.g., filenames or placeholder text)
- F38: Failure of Success Criterion 1.1.1 due to not marking up decorative images in HTML in a way that allows assistive technology to ignore them
- F39: Failure of Success Criterion 1.1.1 due to providing a text alternative that is not null (e.g., alt=”spacer” or alt=”image”) for images that should be ignored by assistive technology
- F65: Failure of Success Criterion 1.1.1 due to omitting the alt attribute or text alternative on img elements, area elements, and input elements of type = “image”
- G94: Providing short text alternative for non-text content that serves the same purpose and presents the same information as the non-text content
- G95: Providing short text alternatives that provide a brief description of the non-text content
- G143: Providing a text alternative that describes the purpose of the CAPTCHA
- G144: Ensuring that the Web Page contains another CAPTCHA serving the same purpose using a different modality
- H36: Using alt attributes on images used as submit buttons
- H37: Using alt attributes on img elements
- H67: Using null alt text and no title attribute on img elements for images that AT should ignore
- H86: Providing text alternatives for ASCII art, emoticons, and leetspeak
- PDF1: Applying text alternatives to images with the Alt entry in PDF documents
- PDF4: Hiding decorative images with the Artifact tag in PDF documents
- PDF7: Performing OCR on a scanned PDF document to provide actual text
- W3C Tutorial: Decorative Images
- W3C Tutorial: Functional Images
- W3C Tutorial: Informative Images